@import '../style/theme/color';
@import '../style/theme/shadow';
@import '../style/theme/color';

.devui-quadrant-diagram {
  position: relative;
}

.devui-control-zoom-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px;
  position: absolute;
  top: -4px;
  height: 32px;
  width: 96px;
  box-shadow: $devui-shadow-length-base $devui-shadow;
  background: $devui-base-bg;
  z-index: 10;
}

.devui-icon-display {
  cursor: pointer;

  svg g polygon,
  svg g g,
  svg g path {
    fill: $devui-icon-text;
  }

  &:hover {
    svg g polygon,
    svg g g,
    svg g path {
      fill: $devui-brand;
    }
  }
}

.disabled {
  cursor: not-allowed;

  svg g polygon,
  svg g g,
  svg g path {
    fill: $devui-disabled-text;
  }
}
